@using Elsa.Studio.DomInterop.Contracts
@using Elsa.Studio.Localization
@using Elsa.Studio.Localization.Time.Components
@using Elsa.Studio.Models

<style>
    .hover-row:hover .icon-on-hover {
        visibility: visible;
    }

    .icon-on-hover {
        visibility: hidden;
    }
</style>

<div>
    <MudText Typo="Typo.overline" GutterBottom="true" Align="Align.Left">@Title</MudText>
    @if (Data.Any())
    {
        <MudSimpleTable Outlined="true" Striped="false" Dense="true" Elevation="0" Bordered="false">
            <tbody>
            @{
                var data = HideEmptyValues
                    ? Data.Where(x => !string.IsNullOrWhiteSpace(x.Text)).ToList()
                    : Data;
            }
            @if (data.Any())
            {
                @foreach (var item in data)
                {
                    <tr Class="hover-row">
                        <td style="width: 200px;">@item.Label</td>
                        <td>
                            <MudStack Row=true Spacing="1" AlignItems="AlignItems.Center">
                                <MudTooltip Text="@Localizer["View content"]">
                                @if (!string.IsNullOrWhiteSpace(item.Text))
                                {
                                    <MudIconButton Icon="@Icons.Material.Outlined.ManageSearch" Size="Size.Small" Title="@Localizer["View content"]" OnClick="@(() => OnViewClicked(item!))" Disabled="@(string.IsNullOrWhiteSpace(item.Text))" Class="icon-on-hover" />
                                }
                                </MudTooltip>
                                @if (!string.IsNullOrWhiteSpace(item.Link))
                                {
                                    <MudLink Typo="Typo.body2" Href="@item.Link">@item.Text</MudLink>
                                }
                                else if (item.OnClick != null)
                                {
                                    <MudLink Typo="Typo.body2" OnClick="@item.OnClick">@item.Text</MudLink>
                                }
                                else
                                {
                                    @if (item.Label == "Created" || item.Label == "Updated" || item.Label == "Finished")
                                    {
                                        <span><Timestamp Value="@Convert.ToDateTime(item.Text)"></Timestamp></span>
                                    }
                                    else
                                    {
                                        @if (item.Text?.Length > truncationLength)
                                        {
                                            <div>
                                                @item.Text.Substring(0, truncationLength)
                                                <MudTooltip Text="Show all">
                                                    <MudLink OnClick="@(() => OnViewClicked(item!))" title="Show all"><small>[...]</small></MudLink>
                                                </MudTooltip>
                                            </div>
                                        }
                                        else
                                        {
                                            <span>@item.Text</span>
                                        }
                                    }
                                }
                            </MudStack>
                        </td>
                        <td style="width: 50px;">
                            <MudTooltip Text="Copy">
                                <MudIconButton Icon="@Icons.Material.Outlined.ContentCopy" Size="Size.Small" Title="@Localizer["Copy"]" OnClick="@(x => OnCopyClicked(item!))" Disabled="@(string.IsNullOrWhiteSpace(item.Text))" />
                            </MudTooltip>
                        </td>
                    </tr>
                }
            }
            else
            {
                if (ShowNoDataAlert)
                {
                    <MudAlert Severity="Severity.Normal" Dense="true" Variant="Variant.Text">@NoDataMessage</MudAlert>
                }
            }
            </tbody>
        </MudSimpleTable>
    }
    else
    {
        <MudAlert Severity="Severity.Normal" Dense="true" Variant="Variant.Text">@(NoDataMessage)</MudAlert>
    }
</div>

@code {
    private int truncationLength = 300;

    /// <summary>
    /// The data to display.
    /// </summary>
    [Parameter]
    public DataPanelModel Data { get; set; } = new();

    /// <summary>
    /// If true, empty values will be hidden.
    /// </summary>
    [Parameter]
    public bool HideEmptyValues { get; set; }

    /// <summary>
    /// If true, a message will be displayed when there is no data.
    /// </summary>
    [Parameter]
    public bool ShowNoDataAlert { get; set; }

    /// <summary>
    /// The title of the data panel
    /// </summary>
    [Parameter]
    public string Title { get; set; } = null!;

    /// <summary>
    /// The message to display when there is no data.
    /// </summary>
    [Parameter] public string NoDataMessage { get; set; } = "No data available.";

    [Inject] private ILocalizer Localizer { get; set; } = null!;
    [Inject] private IClipboard Clipboard { get; set; } = null!;

    [Inject] private ISnackbar Snackbar { get; set; } = null!;

    [Inject] private IDialogService DialogService { get; set; } = null!;


    private async Task OnCopyClicked(DataPanelItem item)
    {
        await Clipboard.CopyText(item.Text);
        Snackbar.Add($"{item.Label} copied", Severity.Success);
    }

    private async Task OnViewClicked(DataPanelItem item)
    {
        var options = new DialogOptions
        {
            CloseOnEscapeKey = true,
            Position = DialogPosition.Center,
            FullWidth = true,
            MaxWidth = MaxWidth.Large
        };
        var parameters = new DialogParameters
        {
            { nameof(DataPanelItem), item }
        };
        await DialogService.ShowAsync<ContentFormatter>("View value", parameters, options);
    }
}